// Get CSS value as a number, instead of string!
jQuery.fn.cssNumber = function(prop){
    var v = parseInt(this.css(prop),10);
    return isNaN(v) ? 0 : v;
}

// update or store item in list.
jQuery.fn.listStore = function(){
	$item_list[this.attr('id')] = [this.cssNumber('left'),this.cssNumber('top'),this.width(),this.height()];
	display();
}

// Delete item from list. IN A FANCY WAY!
jQuery.fn.listDelete = function(FUN){
	if(!confirm("Do you wish to delete this selection?")){ return }
	var $this = this;
	var $wid = $this.width();
	var $hgt = $this.height();
	var $top = $this.cssNumber("top");
	var $left = $this.cssNumber("left");
	var $speed = ($wid+$hgt)/2; // make deletion speed dynamic based on size.
	delete $item_list[this.attr('id')];
	this.animate({ "width" : $wid+8 , "height" : $hgt+8 , "top" : $top-4 , "left" : $left-4 },120,function(){
		$this.animate({ "width" : 4 , "height" : 4 , "top" : $top+($hgt/2)-2 , "left" : $left+($wid/2)-2 },$speed,function(){
		$this.remove();
		store();
		if(jQuery.isFunction(FUN)){
        FUN.call($this);
      }})})

}

// Show information in data field (debug) and store info in form field.
function store(){
	var $text = JSON.stringify($item_list);
//	$("#data").text($text);
	$("#hotspots").val($text);
	var $canpos = JSON.stringify($("#canvas").Pos());
	$("#canvas-position").val($canpos);}

// Create an item!
jQuery.fn.create_item = function(){
	this.draggable({
		revert: true
	}).resizable({ stop: function(){
	var $this = $(this).attr('id');
	$item_list[$this].width = ($(this).width()/$("#canvas").width())*100;
	$item_list[$this].height = ($(this).height()/$("#canvas").height())*100;
	store();
}}).dblclick(function(){
	$(this).openMenu();
}).children('close').mouseup(function(){
	// Make delete button work
	$(this).parent().listDelete();
});
}

jQuery.fn.prep = function(){
	this.each(function(i, obj){
		var $wid = obj.width();
		obj.css({ 'width' : $wid });
	})
}

// Choose a placeholder name that is not in use currently.
function get_temp_name(){
	for (var i=1;i<100;i++){
		var $name = 'temp #'+i;
		if(!$item_list[$name]){
			return $name;}}}

//get elements position or position relative to other elements.
jQuery.fn.Pos = function($relative){
	var offset = this.offset();
	var wid = this.width();
	var hgt = this.height();
	if($relative){
		var offset2 = $relative.offset();
		var wid2 = $relative.width();
		var hgt2 = $relative.height();
		offset['top'] = offset2.top - offset.top;
		offset['left'] = offset2.left - offset.left;
		wid = wid2 - wid;
		hgt = hgt2 - hgt;}
	return {left: offset.left, top: offset.top, width: wid, height: hgt};
}

jQuery.fn.openMenu = function(){
	if($(".options").data('open')){ return false }
	var $this = this;
	var $offset = $this.offset();
	var $name = $this.attr('id');
	var $html = '<div class="options">'+$name+'<br><br><p id="buttrename" class="unselected">RENAME</p><p id="buttlink" class="unselected">LINK</p><p id="buttimage" class="unselected">BACKGROUND</p><p id="buttdelete" class="unselected">DELETE</p><p id="buttclose" class="unselected">CLOSE</p></div>';
	var $menu = $("body").append($html).children(".options").css({ 'top' : $offset.top-20 , 'left' : $offset.left+40 }).draggable().data('open' , true);
	$menu.children(".unselected").hover(function(){
		$(this).toggleClass('unselected').toggleClass('selected');
	}, function(){
		$(this).toggleClass('unselected').toggleClass('selected');
	});

	$menu.children("#buttrename").click(function(){ // Rename selection.
		var $new_id = prompt('Enter a new Selection name.', $name);
		if ($new_id!=null && $new_id!=""){
			if($item_list[$new_id]){ alert('Name is already in use.'); return false; }
		$this.attr('id' , $new_id);
		$this.children("center").text($new_id);
		$item_list[$new_id] = $item_list[$name];
		delete $item_list[$name];
		store();
		$menu.remove();}
	});

	$menu.children("#buttlink").click(function(){ // Create link to new page.
		var $link = $item_list[$name].link;
		if(!$link){ $link = 'enter page number'; }
		var $new_link = prompt('Enter a new Selection name.', $link);
		if ($new_link!=null && $new_link!=""){
			$item_list[$name].link = $new_link;
			store();
			$menu.remove();}

	});

	$menu.children("#buttimage").click(function(){// set background image.
		var $old_img = $("#canvas .fullscreen").attr('src');
		var $new_img = prompt('Enter a new Selection name.', $old_img);
		if ($new_img!=null && $new_img!=""){
			$("#background").val($new_img);
			$("#canvas .fullscreen").attr('src', $new_img).load(function(){
				$menu.remove();
			});
			}
	});

	$menu.children("#buttdelete").click(function(){// Delete selection.
		$this.listDelete(function(){
			$menu.remove();
		});
	});

	$menu.children("#buttclose").click(function(){ // Close the menu.
		$menu.remove();
	});
}
